<template>
    <div class="table" v-loading.body="saveloading">
        <div class="crumbs">
            <el-breadcrumb separator="/">
                <el-breadcrumb-item :to="{ path: '/testcategory' }">考试分类</el-breadcrumb-item>
                <el-breadcrumb-item>{{test_category.title}}</el-breadcrumb-item>
                <el-breadcrumb-item>考点设置</el-breadcrumb-item>
            </el-breadcrumb>
        </div>
        <div class="handle-box">
            <el-button type="success" icon="save" class="handle-del mr10" @click="update">更新</el-button>
<!--             <el-button type="warning" icon="setting" class="handle-del mr10" @click="regenerate">重置</el-button> -->
        </div>
        <el-table :data="tableData" border style="width: 100%" ref="multipleTable" @selection-change="handleSelectionChange">
            <el-table-column label="#">
             <template scope="scope">
                {{scope.$index+1}}
                </template>
            </el-table-column>
            <el-table-column label="id" prop="id">
            </el-table-column>
<!--             <el-table-column type="selection" width="55"></el-table-column> -->
            <el-table-column prop="title" label="标题" width="340">
                <template scope="scope">
                    {{scope.row.prefix}} {{scope.row.title}}
                </template>
            </el-table-column>
            <el-table-column prop="code" label="编码">
                <template scope="scope">
                    <el-tag type="primary" v-show="scope.row.code != ''">{{scope.row.code}}</el-tag>
                </template>
            </el-table-column>
<!--             <el-table-column label="左右值">
                <template scope="scope">
                    <el-tag type="gray">{{scope.row.lft}},{{scope.row.rgt}}</el-tag>
                </template>
            </el-table-column> -->
            <el-table-column label="题目数量">
                <template scope="scope">
                    <el-input v-model="currentRow.point_setting[scope.row.id]" auto-complete="off" v-show="scope.row.level > 3"></el-input>
                </template>
            </el-table-column>
<!--             <el-table-column label="操作" width="180">
                <template scope="scope">
                    <el-button size="small" @click="handleEdit(scope.$index, scope.row)">编辑</el-button>
                    <el-button size="small" type="danger" v-show="scope.row.pid > 0" @click="handleDelete(scope.$index, scope.row)">删除</el-button>
                </template>
            </el-table-column> -->
        </el-table>
<!--         <div class="pagination">
            <el-pagination
                    @current-change ="handleCurrentChange"
                    layout="prev, pager, next"
                    :current-page.sync="pagination.current"
                    :page-size="pagination.size"
                    :total="pagination.total">
            </el-pagination>
        </div> -->
    </div>
</template>

<script>
    import http from "../../lib/http"
    import tree from "../../lib/tree"
    export default {
        data : function() {
            var params = this.$route.path.split("-")
            this.category_id = params[1]
            return {
                //url: './static/vuetable.json',
                isadding : false,
                tableData: [],
                cur_page: 1,
                test_category : {},
                multipleSelection: [],
                select_cate: '',
                select_word: '',
                del_list: [],
                is_search: false,
                saveloading : false,
                currentRow : {point_setting : {}},
                sortPoint : [],
                dataTotal : 0,
                libtype : [{
                    label : '普通题型',
                    value : '0'
                },{
                    label : '材料题型',
                    value : '1'
                }],
                category : {
                    id : '',
                    title : '',
                    code : '',
                    pid : "1",
                    level : "0",
                    ordering : 0,
                    lib_type : '0'
                },
                pagination : {
                    current : 1,
                    total : 0,
                    size : 1000000
                }
            }
        },
        created : function(){
            var self = this
            http.alive(this,function(){
                self.getData();
                self.getTestCategory(self.category_id)
            })
        },

        computed: {
            data : function(){
                const self = this;
                // return self.tableData.filter(function(d){
                //     let is_del = false;
                //     for (let i = 0; i < self.del_list.length; i++) {
                //         if(d.name === self.del_list[i].name){
                //             is_del = true;
                //             break;
                //         }
                //     }
                //     if(!is_del){
                //         if(d.address.indexOf(self.select_cate) > -1 && 
                //             (d.name.indexOf(self.select_word) > -1 ||
                //             d.address.indexOf(self.select_word) > -1)
                //         ){
                //             return d;
                //         }
                //     }
                // })
            }
        },
        methods: {
            handleCurrentChange : function(val){
                this.cur_page = val;
                this.getData();
            },
            getTestCategory : function(id){
                let self = this
                http.get(this,"test_category/"+id).then(function(res){
                    self.test_category = res.data.data
                    if(!!res.data.data.point_setting){
                        self.currentRow.point_setting = JSON.parse(res.data.data.point_setting)
                    }
                })
            },
            getData : function(){
                let self = this;
                http.get(self,"point_categories").then((res) => {
                    var response = res.data
                    if (response.code == "ok") {
                        self.tableData = tree.make(response.data,"pid",0)
                        for(var i=0,j=self.tableData.length;i<j;i++){
                            self.sortPoint[i] = self.tableData[i].id
                        }
                        self.pagination.total = response.total * 1
                    }
                })
                // if(process.env.NODE_ENV === 'development'){
                //     self.url = '/ms/table/list';
                // };
                // self.$axios.post(self.url, {page:self.cur_page}).then((res) => {
                //     self.tableData = res.data.list;
                // })
            },
            // search(){
            //     this.is_search = true;
            // },
            create : function(){
                this.isadding = true
                this.category = {
                    id : '',
                    title : '',
                    code : '',
                    pid : "1",
                    level : "0",
                    ordering : 0
                }
                
            },
            regenerate : function(){
                var self = this
                http.post(this,"test_point_category/manage/regenerate").then(function(res){
                    var data = res.data
                    if (data.code == "ok") {
                        self.getData()
                        self.$notify.success({
                            title : "成功",
                            message : "重置成功"
                        })
                    }
                    else{
                        self.$notify.error({
                            title : "错误",
                            message : "重置失败"
                        })
                    }
                })
            },
            save : function(){
                var self = this
                this.saveloading = true
                http.post(this,"point_category",this.category).then((res)=>{
                    self.saveloading = false
                    self.isadding = false
                    var data = res.data
                    if (data.code == "ok") {
                        self.getData()
                    }
                    else{
                        self.$notify.error({
                            title : "错误",
                            message : data.msg
                        })
                    }
                })
            },
            update : function(){
                this.saveloading = true
                var self = this
                var postJson = []
                for(var i=0,j=this.sortPoint.length;i<j;i++){
                    if(this.currentRow.point_setting.hasOwnProperty(this.sortPoint[i]) && this.currentRow.point_setting[this.sortPoint[i]] != ""){
                        postJson[postJson.length] = '"'+this.sortPoint[i]+'":"'+this.currentRow.point_setting[this.sortPoint[i]]+'"'
                    }
                }
                var pprams = "{"+postJson.join(",")+"}"
                
                console.log(pprams)

                http.post(this,"test_categories/"+this.category_id+"/setting2",{"id":this.category_id,"p":pprams}).then(function(res){
                     self.saveloading = false
                     self.$notify.success({
                            title : "成功",
                            message : "设置成功"
                        })
                })
            },
            // update : function(){
            //     var self = this
            //     this.saveloading = true
            //     http.put(this,"point_category",this.category).then((res) => {
            //         self.isadding = false
            //         self.saveloading = false
            //         var data = res.data
            //         if (data.code == "ok") {
            //             self.getData()
            //             self.$notify.success({
            //                 title : "成功",
            //                 message : "更新成功"
            //             })
            //         }
            //         else{
            //             self.$notify.error({
            //                 title : "错误",
            //                 message : data.msg
            //             })
            //         }
            //     })
            // },

            handleEdit : function(index, category) {
                this.isadding = true
                this.category.id = category.id
                this.category.pid = category.pid
                this.category.title = category.title
                this.category.code = category.code
                this.category.ordering = category.ordering
                this.category.level = category.level
                //this.$message('编辑第'+(index+1)+'行');
            },
            handleDelete : function(index, row) {
                //this.$message.error('删除第'+(index+1)+'行');
                var self = this
                this.$confirm('此操作将删除节点以及子节点,是否继续?', '提示', {
                  confirmButtonText: '确定',
                  cancelButtonText: '取消',
                  type: 'warning'
                }).then(() => {
                    if (row.pid == 0) {
                        self.$notify.error({
                          title: '错误',
                          message: '根节点不允许删除'
                        });
                    }
                    else{
                        http.delete(this,"point_category/"+row.id).then(function(res){
                            self.getData()
                        })
                    }
                }).catch(() => {
     
                });
            },

            handleSelectionChange :function(val) {
                this.multipleSelection = val;
            }
        }
    }
</script>

<style scoped>
.handle-box{
    margin-bottom: 20px;
}
.handle-select{
    width: 120px;
}
.handle-input{
    width: 300px;
    display: inline-block;
}
</style>